﻿<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta name=”renderer” content=”webkit|ie-comp|ie-stand”/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit">
    <link rel="icon" href="/favicon.ico">

    <title>发票识别</title>
    <link href="/assets/plugins/font/css/font-awesome.min.css" rel="stylesheet"/>
    <link href="/assets/plugins/bootstrap/bootstrap.min.css" rel="stylesheet"/>


    <link href="/module/style/lr-common.css" rel="stylesheet"/>
    <link href="/module/plugin/scroll/scroll.css" rel="stylesheet"/>
    <link href="/module/style/lr-iframe-form.css" rel="stylesheet"/>
    <link href="/module/style/lr-iframe-index.css" rel="stylesheet"/>
    <link href="/module/plugin/layout/lr-layout.css" rel="stylesheet"/>
    <link href="/module/plugin/wizard/wizard.css" rel="stylesheet"/>
    <link href="/module/plugin/tree/lr-tree.css" rel="stylesheet"/>
    <link href="/module/plugin/select/lr-select.css" rel="stylesheet"/>

    <link href="/module/plugin/timeline/lr-timeline.css" rel="stylesheet"/>
    <link href="/module/plugin/formselect/lr-formselect.css" rel="stylesheet"/>
    <link href="/module/plugin/inputsearch/lr-isearch.css" rel="stylesheet"/>
    <link href="/module/plugin/grid/jfgrid.css" rel="stylesheet"/>
    <link href="/module/plugin/uploader/lr-uploader.css" rel="stylesheet"/>
    <link href="/module/plugin/date/lr-datepicker.css" rel="stylesheet"/>
    <link href="/assets/plugins/webuploader/webuploader.css" rel="stylesheet"/>

    <link href="index.css" rel="stylesheet"/>

    <script src="/assets/plugins/jquery/jquery-1.10.2.min.js"></script>
    <script src="/assets/plugins/jquery/jquery.md5.min.js"></script>
    <script src="/assets/plugins/jquery/plugin/jqprint/jquery.jqprint-0.3.js"></script>
    <script src="/assets/plugins/laydate/laydate.js"></script>
    <script src="/assets/plugins/ueditor/ueditor.config.js"></script>
    <script src="/assets/plugins/ueditor/ueditor.all.min.js"></script>
    <script src="/assets/plugins/ueditor/lang/zh-cn/zh-cn.js"></script>
    <script src="/assets/plugins/webuploader/webuploader.nolog.min.js"></script>

    <!--[if lt IE 9]>
    <script src="/assets/plugins/bootstrap/html5shiv.min.js"></script>
    <script src="/assets/plugins/bootstrap/respond.min.js"></script>
    <![endif]-->
    <script>
        function request(d) {
            for (var c = location.search.slice(1).split("&"), a = 0; a < c.length; a++) {
                var b = c[a].split("=");
                if (b[0] == d) if ("undefined" == unescape(b[1])) break; else return unescape(b[1])
            }
            return ""
        };
    </script>
    <style>
        .qr-scanner {
            margin-top: -220px;
            background-image:
                    linear-gradient(0deg,
                    transparent 24%,
                    rgba(32, 255, 77, 0.1) 25%,
                    rgba(32, 255, 77, 0.1) 26%,
                    transparent 27%,
                    transparent 74%,
                    rgba(32, 255, 77, 0.1) 75%,
                    rgba(32, 255, 77, 0.1) 76%,
                    transparent 77%,
                    transparent),
                    linear-gradient(90deg,
                    transparent 24%,
                    rgba(32, 255, 77, 0.1) 25%,
                    rgba(32, 255, 77, 0.1) 26%,
                    transparent 27%,
                    transparent 74%,
                    rgba(32, 255, 77, 0.1) 75%,
                    rgba(32, 255, 77, 0.1) 76%,
                    transparent 77%,
                    transparent);
            background-size: 3rem 3rem;
            background-position: -1rem -1rem;
            width: 100%;
            height: 100%;
            position: relative;
            /*background-color: #111;*/
        }

        .qr-scanner .box {
            width: 75vw;
            height: 35vw;
            max-height: 35vh;
            max-width: 75vh;
            position: relative;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            overflow: hidden;
            border: 0.1rem solid rgba(0, 255, 51, 0.2);
        }

        .qr-scanner .line {
            height: calc(100% - 2px);
            width: 100%;
            background: linear-gradient(180deg, rgba(0, 255, 51, 0) 43%, #00ff33 211%);
            border-bottom: 3px solid #00ff33;
            transform: translateY(-100%);
            animation: radar-beam 2s infinite;
            animation-timing-function: cubic-bezier(0.53, 0, 0.43, 0.99);
            animation-delay: 1.4s;
        }

        .qr-scanner .box:after,
        .qr-scanner .box:before,
        .qr-scanner .angle:after,
        .qr-scanner .angle:before {
            content: '';
            display: block;
            position: absolute;
            width: 3vw;
            height: 3vw;

            border: 0.2rem solid transparent;
        }

        .qr-scanner .box:after,
        .qr-scanner .box:before {
            top: 0;
            border-top-color: #00ff33;
        }

        .qr-scanner .angle:after,
        .qr-scanner .angle:before {
            bottom: 0;
            border-bottom-color: #00ff33;
        }

        .qr-scanner .box:before,
        .qr-scanner .angle:before {
            left: 0;
            border-left-color: #00ff33;
        }

        .qr-scanner .box:after,
        .qr-scanner .angle:after {
            right: 0;
            border-right-color: #00ff33;
        }

        @keyframes radar-beam {
            0% {
                transform: translateY(-100%);
            }

            100% {
                transform: translateY(0);
            }
        }
    </style>
</head>
<body class="Chrome 64.0 lr-uitheme-top">
<div id="lr_form_bg" class="lr-form-bg">
</div>


<div class="lr-form-layout lr-form-layout-top-bottom">
    <div class="moduleWrap">
        <div class="moduleTitle">
            <h1>功能演示</h1>
        </div>
        <div class="moduleCont">
            <div class="demo">
                <div class="row2">
                    <div class="clo_9" style="position: relative;text-align: center;width:60%;">
                        <img id="img_invoice" src="/content/images/ocr/fp_demo.jpg" height="430" width="720">
                        <div id="qr-scanner" class="qr-scanner" style="display: none;">
                            <div class="box">
                                <div class="line"></div>
                                <div class="angle"></div>
                            </div>
                        </div>
                        <div class="scan" style="display: none"></div>
                    </div>
                    <div class="clo_3" style="width:40%;">
                        <div class="r">
                            <div class="tit">
                                <img src="/content/images/ocr/tit.png">
                                <span>识别结果</span>
                            </div>
                            <div class="plateNO">
                                <div id="tblist">
                                    <table>
                                        <tbody id="ocr_result">
                                        <tr>
                                            <td>发票类型:</td>
                                            <td>电子普通发票</td>
                                        </tr>
                                        <tr>
                                            <td>专票/普票:</td>
                                            <td>普票</td>
                                        </tr>
                                        <tr>
                                            <td>发票代码:</td>
                                            <td>032001700211</td>
                                        </tr>
                                        <tr>
                                            <td>发票号码:</td>
                                            <td>94426666</td>
                                        </tr>
                                        <tr>
                                            <td>校验码:</td>
                                            <td>68117634694064673721</td>
                                        </tr>
                                        <tr>
                                            <td>开票日期:</td>
                                            <td>2018年11月12日</td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <img id="loaading" class="load" src="/content/images/ocr/loding.gif" style="display: none;">
                            </div>
                        </div>
                    </div>
                </div>

                <div id="lr_add_file_btn" style="float: right;"><i class="fa fa-cloud-upload"></i>上传图片</div>
                <div class="upload">
                    <p>提示：可支持PNG、JPG、JPEG，图片大小不超过3M，长边不大于3072像素，请保证图片上的文字人眼可分辨</p>
                </div>
            </div>
        </div>
    </div>
    <div class="lr-form-file-queue-wrap" id="lr_form_file_queue">

    </div>
</div>

<script src="index.js"></script>

<script src="/module/config.js"></script>
<script src="/module/plugin/resize/resize.js"></script>
<script src="/module/plugin/mousewheel/mousewheel.js"></script>
<script src="/module/plugin/layout/lr-layout.js"></script>
<script src="/module/plugin/scroll/scroll.js"></script>
<script src="/module/plugin/tree/lr-tree.js"></script>
<script src="/module/plugin/select/lr-select.js"></script>
<script src="/module/plugin/timeline/lr-timeline.js"></script>
<script src="/module/plugin/formselect/lr-formselect.js"></script>
<script src="/module/plugin/date/lr-datepicker.js"></script>
<script src="/module/plugin/grid/jfgrid.js"></script>
<script src="/module/plugin/wizard/wizard.js"></script>
<script src="/module/plugin/uploader/lr-uploader.js"></script>
<script src="/module/script/lr-fileupload.js"></script>
<script src="/module/script/lr-validator.js"></script>
<script src="/module/script/lr-authorize.js"></script>
<script src="/module/script/lr-excel.js"></script>
<script src="/module/script/lr-form.js"></script>

<script>
    var lrModuleButtonList;
    var lrModuleColumnList;
    var lrModule;
    $.lrToken = config.getToken().access_token;
    $(function () {
        $('#lr_form_bg').fadeOut();
        $('#form').lrscroll();


        if (!!window.bootstrap) {
            bootstrap(jQuery, top.learun);
        }
    });
</script>

</body>
</html>

